<template>
	<div class="index" style="background: rgb(246, 248, 251);" >
    <van-nav-bar title="加盟站点" left-arrow  @click-left="onClickLeft" />
    <div style="padding:0.3rem; ">
      <div class="flexcc" style="height: 90vh;" v-if="!info">
        <img src="../../../static/img/jiameng.png" style="width: 4.5rem;" />
      </div>
      <div v-if="info">
        <div v-html="info" style="font-size: 12px;"></div>
      </div>
      <div style="position: fixed; bottom: 0.5rem; left: 0.5rem; width: 6.6rem;">
        <div @click="show = true" class="flexcc" style="background: rgb(0, 90, 255);  height: 0.9rem; box-shadow: 0px 0.1rem 0.2rem 0px rgba(0, 90, 255, 0.1); border-radius: 0.45rem; font-size: 0.31rem; color: rgb(255, 255, 255);">
          创建我的站点
        </div>
        <div @click="show2 = true" style="font-size: 14px; text-align: center; margin-top: 0.2rem;">已有站点 <span style="color:rgb(0, 90, 255); font-weight: bold; margin-left: 0.1rem;">登录</span></div>
      </div>

    </div>
    <van-popup v-model="show" round position="bottom">
      <div style="padding: 0.3rem; font-size: 0.26rem;">
        <div class="flexc">
          <div style="font-size: 0.4rem;"><van-icon name="friends" /></div>
          <div style="font-size: 0.3rem; font-weight: bold; margin-left: 0.1rem;">账号信息</div>
        </div>
        <div>
          <div style="margin-top: 0.2rem;"><van-field v-model="all.name" round placeholder="请输入登录账号名" /></div>
          <div style="margin-top: 0.2rem;"><van-field v-model="all.password" type="password" placeholder="请输入登录密码" /></div>
          <div style="margin-top: 0.2rem;"><van-field v-model="all.mobile" placeholder="请输入手机号" /></div>
          <div style="margin-top: 0.2rem;">
            <van-field  v-model="all.sms_code"  center clearable placeholder="请输入短信验证码">
              <template #button>
                <div style="color: rgb(0, 90, 255);" @click="getcode()">{{yzm}}</div>
              </template>
            </van-field>
          </div>
          <div style="margin-top: 0.2rem;"><van-field v-model="all.micro_stores_name" placeholder="请输入您的小店名称" /></div>
          <div @click="chuangjian(item)" class="flexcc" style="background: rgb(0, 90, 255);  height: 0.9rem; margin-top: 0.2rem; box-shadow: 0px 0.1rem 0.2rem 0px rgba(0, 90, 255, 0.1); border-radius: 0.45rem; font-size: 0.31rem; color: rgb(255, 255, 255);">确认创建</div>
        </div>
        <div @click="show2 = true" style="font-size: 14px; text-align: center; margin-top: 0.2rem;">已有站点 <span style="color:rgb(0, 90, 255); font-weight: bold; margin-left: 0.1rem;">登录</span></div>
      </div>
    </van-popup>
    <van-popup v-model="show2" round position="bottom">
      <div style="padding: 0.3rem; font-size: 0.26rem;">
        <div class="flexc">
          <div style="font-size: 0.4rem;"><van-icon name="friends" /></div>
          <div style="font-size: 0.3rem; font-weight: bold; margin-left: 0.1rem;">账号登录</div>
        </div>
        <div>
          <div style="margin-top: 0.2rem;"><van-field v-model="all2.name" round placeholder="请输入登录账号名" /></div>
          <div style="margin-top: 0.2rem;"><van-field v-model="all2.password" ref="mima" type="password" placeholder="请输入登录密码" /></div>

          <div @click="denglu()" class="flexcc" style="background: rgb(0, 90, 255);  height: 0.9rem; margin-top: 0.2rem; box-shadow: 0px 0.1rem 0.2rem 0px rgba(0, 90, 255, 0.1); border-radius: 0.45rem; font-size: 0.31rem; color: rgb(255, 255, 255);">登录</div>
          <div @click="weixindenglu()" v-if="jingdong" class="flexcc" style="background: #37C512;  height: 0.9rem; margin-top: 0.2rem; box-shadow: 0px 0.1rem 0.2rem 0px rgba(0, 90, 255, 0.1); border-radius: 0.45rem; font-size: 0.31rem; color: rgb(255, 255, 255);">微信登陆</div>
        </div>
      </div>
    </van-popup>

    <van-popup v-model="show3" round position="bottom" :close-on-click-overlay="false">
      <div style="padding: 0.3rem; font-size: 0.26rem;">
        <div class="flexc">
          <div style="font-size: 0.4rem;"><van-icon name="friends" /></div>
          <div style="font-size: 0.3rem; font-weight: bold; margin-left: 0.1rem;">请绑定已注册账号</div>
        </div>
        <div>
          <div style="margin-top: 0.2rem;"><van-field v-model="all2.name" round placeholder="请输入登录账号名" /></div>
          <div style="margin-top: 0.2rem;"><van-field v-model="all2.password" ref="mima" type="password" placeholder="请输入登录密码" /></div>

          <div @click="bangding()" class="flexcc" style="background: rgb(0, 90, 255);  height: 0.9rem; margin-top: 0.2rem; box-shadow: 0px 0.1rem 0.2rem 0px rgba(0, 90, 255, 0.1); border-radius: 0.45rem; font-size: 0.31rem; color: rgb(255, 255, 255);">确定</div>
        </div>
      </div>
    </van-popup>
	</div>
</template>

<script>
  var h = document.documentElement.clientWidth / 7.5 + 'px';
  document.documentElement.style.fontSize = h;
	export default {
		name: 'query',
		data() {
			return {
        show:false,
        show2:false,
        show3:false,
        weixinall:"",
        all:{
          name:"",
          password:"",
          mobile:"",
          sms_code:"",
          shop_id:"",
          micro_stores_name:""
        },
        all2:{
          name:"",
          password:""
        },
        info:"",
        yzmnum:60,
        yzm:'获取验证码',
        yzmuse:true,
        jingdong:false
			}
		},
		created() {
      if(this.$route.query.shop_id){
        this.all.shop_id = window.atob(this.$route.query.shop_id)
      }
      this.getinfo()
      if(location.hostname == 'kajia.vip' || location.hostname == 'cs.xiaoluohao.vip' || location.hostname == 'duotest.weibu.vip'){
        this.jingdong = true
      }
      if(this.$route.query.code && this.jingdong){
        console.log('执行登录')
        // access_token: "76_CIdDuHi6VloHy0b20VB_c2wmgpZKbU9_-jCp99XilWDxmbIr1lf8GK6Lkw3PqOhnP0YW__fGDZqFBEzEe1w4e_Tt5IezaVHNCj69LmhDHFI"
        // expires_in: 7200
        // openid: "oO9Og6c3nk3B_HwE-TfFGjx_oKvM"
        // refresh_token: "76_ORxMHGclMcDufwU1kbpR4VwRIi8VDibmhcYdl6pLzLVTms0pWTT1URwqwXH01AQ40Pay2x4y7Q0fNZBKABIyg7TM4ek6O-pF_EmW9s6R4Qg"
        // scope: "snsapi_base"
        // wechat_register: 0
        axios.get('/api/wechat/code2token?code='+this.$route.query.code).then((response)=>{
          if (response.data.msg.code == 0) {
           this.weixinall = response.data.data
           //已绑定账号
           if(response.data.data.wechat_register == 1){
             axios.post('/api/wechat/login',{open_id:this.weixinall.openid}).then((response)=>{
             	if (response.data.msg.code == 0) {
                console.log('换取登录信息')

                if(response.data.data.is_owner == 1){
                  location.href = location.origin + '/hou/shangpinguanli/zaishoushangpin'
                }else{
                  location.href = location.origin + '/h5/geren'+location.search
                }

             	}else {
                 vant.Toast(response.data.msg.info);
             	}
             })
           }else{
             this.show3 = true
           }


          }else {
            vant.Toast(response.data.msg.info);
          }
        })

      }else{

      }
		},
		mounted() {
      document.title = "加盟站点"
		},
		methods: {
      weixindenglu:function(){
        window.location.href = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=wxe9a853825d8c4b19&redirect_uri=http://duotest.weibu.vip/h5/jiameng2&response_type=code&scope=snsapi_base&state=123#wechat_redirect'
      },
      bangding:function(){
        let obj = {
          open_id:this.weixinall.openid,
          name:this.all2.name,
          password:this.all2.password,
          app_id:"wxe9a853825d8c4b19",
        }
        axios.post('/api/wechat/login',obj).then((response)=>{
        	if (response.data.msg.code == 0) {
           console.log('绑定成功')

           if(response.data.data.is_owner == 1){
             setTimeout(()=>{
               location.href = location.origin + '/hou/shangpinguanli/zaishoushangpin'
             },500)
           }else{
             setTimeout(()=>{
               location.href = location.origin + '/h5/geren'+location.search
             },500)
           }

        	}else {
            vant.Toast(response.data.msg.info);
        	}
        })
      },
      denglu:function(){
        axios.post(`/api/login`, this.all2)
        	.then(response=> {
        		if (response.data.msg.code == 0) {
              vant.Toast("登陆成功");
              if(response.data.data.is_owner == 1){
                setTimeout(()=>{
                  location.href = location.origin + '/hou/shangpinguanli/zaishoushangpin'
                },500)
              }else{
                setTimeout(()=>{
                  location.href = location.origin + '/h5/geren'+location.search
                },500)
              }
        		}else{
              vant.Toast(response.data.msg.info);
            }
        	})
      },
      //获取验证码
      getcode: function() {
        var that = this;
        if(that.yzmuse){
          if (this.all.mobile.length != 11) {
          	vant.Toast("请输入正确手机号");
          	return;
          }
          that.yzmuse = false
          that.yzmnum = 60;
          that.timer = setInterval(function() {
          	if (that.yzmnum == 0) {
          		clearInterval(that.timer);
          		that.yzm = '获取验证码';
          		that.yzmuse = true
          	} else {
          		that.yzmuse = false
          		that.yzm = that.yzmnum + '秒重新获取';
          		that.yzmnum = that.yzmnum - 1;
          	}
          }, 1000);

          axios.post(`/api/user/register/code/send`, {mobile:this.all.mobile,type:''})
          	.then(function(response) {
          		if (response.data.msg.code == 0) {
          			vant.Toast("验证码已发送");
          		}else{
                vant.Toast("发送失败");
              }
          	})
        }
      },
      chuangjian:function(){
        axios.post('/api/mstore/join',this.all).then((response)=>{
        	if (response.data.msg.code == 0) {
           vant.Toast("店铺创建成功");
           this.show = false
           this.$router.push('/geren'+location.search)

        	} else {
            vant.Toast(response.data.msg.info);
        	}
        })
      },
      onClickLeft:function(){
        this.$router.back(-1)
      },
      getinfo:function(){
        axios.get('/api/mstore/inv/des').then((response)=>{
        	if (response.data.msg.code == 0) {
           this.info = response.data.data.reseller_inv_des
        	} else {
            vant.Toast(response.data.msg.info);
        	}
        })
      }
		}
	}
</script>


<style scoped lang="less">
  .index{
    .van-cell{ background: rgb(246, 248, 251);}
  }
</style>
